import { Tabs, TabsProps } from 'antd';
import Sidebar from './Sidebar';
import { CloseOutlined } from '@ant-design/icons';
import Workflow from './Workflow';


interface Props {
    onClose: () => void;
}

export default function LlmTabs(props: Props) {
    const { onClose } = props

    const onChange = (key: string) => {
        console.log(key);
    };

    const items: TabsProps['items'] = [
        {
            key: '1',
            label: '节点',
            children: <Sidebar />
        },
        {
            key: '2',
            label: '工具',
            children: '',
        },
        {
            key: '3',
            label: '工作流',
            children: <Workflow />,
        },
    ];

    return (
        <div className='absolute top-[80px] left-[16px] w-[400px] rounded-xl overflow-hidden z-[1000] shadow-md p-2'
            style={{
                borderRadius: '12px',
                overflow: 'hidden',
                background: '#fff',
            }}
        >
            <CloseOutlined onClick={() => {
                onClose()
            }} className='absolute right-4 top-5 text-[16px] z-[999] text-[#667085]' style={{ cursor: 'pointer' }} />
            <Tabs
                onChange={onChange}
                type="card"
                className='bg-white m-[10px]'
                items={items}
            />
        </div>
    )
}
